<template>

  <div class="pmain">

    <div class="l_search">
      <Search></Search>
    </div>
    <div class="publish">



      <div><a href="/publish/hot">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-tuijian"></use>
          </svg>
          <span>热门推荐</span>
        </a></div>
      <div><a href="/publish/hot">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-Book
            "></use>
          </svg>
          <span>学科参考</span></a>
      </div>
      <div><a href="/publish/qikan">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-Book
            "></use>
          </svg>
          <span>期刊导航</span>
        </a>
      </div>
      <div><a href="/publish/duzhe">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-chaoshi
            "></use>
          </svg>
          <span>读者推购</span>
        </a>
      </div>
      <div><a href="#">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-tushuguan

          "></use>
          </svg>
          <span>信息发布</span>
        </a>
      </div>
      <div>
        <a href="#">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-tushuguan
            "></use>
          </svg>
          <span>我的图书馆</span>
        </a>
      </div>
    </div>
  </div>
</template>
<script>
    import Search from '../../components/search'
    import '~/assets/iconfont/iconfont.css'
    export default {
        data() {
            return {
                input3: '',
                select: ''
            }
        },
        components: {
            Search
        },

    }
</script>
<style>
    .icon {
        font-size: 60px;
        width: 1em;
        height: 1em;
        vertical-align: -0.2em;
        fill: currentColor;
        overflow: hidden;
    }

    .l_search {
        max-width: 800px;
        margin: 20px auto;
    }

    .publish {
        width: 820px;
        height: 444px;
        margin: 50px auto;
        display: flex;
        flex-wrap: wrap;
    }

    .publish>div {
        padding-top: 30px;
        margin: 12px;
        width: 244px;
        height: 170px;
        background-color: #fff;
        color: black;
        text-align: center;
        transform: inherit;
        transition: all 0.5s linear;
        box-shadow: #ccc 0px 5px 15px;
    }

    .publish>div:hover {
        transform: translateY(-15px);
    }

    .publish>div a i {
        display: block;
        width: 125px;
        height: 98px;
        margin: 0 auto;
        font-size: 60px;
    }

    .publish>div a span {
        font-size: 18px;
        font-family: "微软雅黑";
    }
</style>
